<html>
<head>
  <script type="text/tiscript">

    // decorator '@when' - filters event type and establishes chain of event handlers
    function @when(func, evtType)
    {
      function t(evt)
      {
        var r = false;
        if( evt.type == evtType) 
          r = func.call(this,evt);
        if(t.next) return t.next.call(this,evt) || r;
        return r;  
      }
      // note 'this' in decorators is a current namespace - class or global (ns)
      var principal = this instanceof Behavior? this : self;
      t.next = principal.onControlEvent; 
      return principal.onControlEvent = t;
    }

    // decorator '@on' - filters evt.target by selector
    function @on(func, selector)
    {
      return function(evt)
      {
        if( evt.target.match(selector) )
          return func(evt);
      }
    }

    // decorator '@key' - filters Event.KEY_DOWN events by keyCode, establishes chain of event handlers on onKey
    function @key(func, keyCode = 0)
    {
      function t(evt)
      {
        var r = false;
        if( evt.type == Event.KEY_DOWN && (!keyCode || keyCode == evt.keyCode)) 
          r = func.call(this,evt);
        if(t.next) return t.next.call(this,evt) || r;
        return r;  
      }
      // note 'this' in decorators is a current namespace - class or global (ns)
      var principal = this instanceof Behavior? this : self;
      t.next = principal.onKey; 
      return principal.onKey = t;
    }

    // decorator '@mouse' - filters mouse events by type, establishes chain of event handlers
    function @mouse(func, mouseEvtType)
    {
      function t(evt)
      {
        var r = false;
        if( evt.type == mouseEvtType) 
          r = func.call(this,evt);
        if(t.next) return t.next.call(this,evt) || r;
        return r;  
      }
      // note 'this' in decorators is a current namespace - class or global (ns)
      var principal = this instanceof Behavior? this : self;
      t.next = principal.onMouse; 
      return principal.onMouse = t;
    }


    class Corpus:Behavior
    {
      @when Event.BUTTON_CLICK @on "button#up" :  
      {
        stdout << "Woohoo!" << "\n";
      }
    }

    @when Event.BUTTON_CLICK @on "button#up"
    function onUpClick()  
    {
      //self.zoom();
      stdout << "Up!" << "\n";
    }

    @when Event.BUTTON_CLICK @on "button#down":
    {
      stdout << "Down!" << "\n";
    }
    
  </script>
  <style>
    body { prototype: Corpus; }
  </style>
</head>
<body>
  <button #up>Up</button>
  <button #down>Down</button>
</body>
</html>